<template>
  <div class="body" v-if="application.parentId != null">
    <div class="tit">开具发票申请单</div>
    <el-form :model="applicationOld" :rules="rules" ref="newform" inline-message>
      <el-container>
        <el-header>
          <el-row>
            <el-col :span="4">
              申请部门
            </el-col>
            <el-col :span="4">
              <el-form-item prop="applicationDepartment">
                <el-input v-model="applicationOld.applicationDepartment" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              申请人
            </el-col>
            <el-col :span="4">
              <el-form-item prop="applyPerson">
                <el-input v-model="applicationOld.applyPerson" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              申请时间
            </el-col>
            <el-col :span="4">
              <el-form-item prop="applyTime">
                <el-input v-model="applicationOld.applyTime" readonly></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="4">
              发票类别
            </el-col>
            <el-col :span="20">
              <el-form-item prop="type">
                <el-select v-model="applicationOld.type" @change="changeType" disabled>
                  <el-option label="外销-形式发票-干箱-自接" value="外销-形式发票-干箱-自接"></el-option>
                  <el-option label="外销-形式发票-干箱-统接" value="外销-形式发票-干箱-统接"></el-option>
                  <el-option label="外销-形式发票-干箱-BSL" value="外销-形式发票-干箱-BSL"></el-option>
                  <el-option label="外销-形式发票-零部件" value="外销-形式发票-零部件"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="4">
              <div>
                <span style="color: red;">*</span><span>合同号</span>
              </div>
            </el-col>
            <el-col :span="8">
              <el-form-item prop="contractNo">
                <el-input v-model="applicationOld.contractNo" disabled></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <div>
                <span style="color: red;">*</span><span>计划回款时间</span>
              </div>
            </el-col>
            <el-col :span="8">
              <el-form-item prop="planPayTime">
                <el-date-picker v-model="applicationOld.planPayTime" type="date" placeholder="Pick a Date"
                  format="YYYY/MM/DD" disabled />
              </el-form-item>
            </el-col>
          </el-row>

        </el-header>
        <el-container>
          <el-col :span="2">
            <el-aside>
              发票信息
            </el-aside>
          </el-col>
          <el-main>
            <el-row>
              <el-col :span="3">
                <div>
                  <span style="color: red;">*</span><span>客户名称</span>
                </div>
              </el-col>
              <el-col :span="21">
                <el-form-item prop="customerName">
                  <el-select v-model="applicationOld.customerName" filterable remote reserve-keyword placeholder="请选择"
                    @change="changeCustomerName" :remote-method="searchCustomer" :loading="loading" disabled>
                    <el-option v-for="item in customerNameOptions" :key="item.id" :label="item.name"
                      :value="item.name" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                地址
              </el-col>
              <el-col :span="21">
                <el-form-item prop="customerAddress">
                  <el-input v-model="applicationOld.customerAddress" readonly></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                <div>
                  <span style="color: red;">*</span><span>价格条款</span>
                </div>
              </el-col>
              <el-col :span="21">
                <el-form-item prop="priceTerms">
                  <el-radio-group v-model="applicationOld.priceTerms" @change="changePrice" disabled>
                    <el-radio label="CY" disabled>CY</el-radio>
                    <el-radio label="Ex-Works" disabled>Ex-Works</el-radio>
                    <el-radio label="DAP">DAP</el-radio>
                    <el-radio label="otherOld" disabled>其他<input type="text" style="width:250px"
                        v-model="otherOld"></el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                <div>
                  <span style="color: red;">*</span><span>付款条款</span>
                </div>
              </el-col>
              <el-col :span="21">
                <el-form-item prop="paymentProvision">
                  <el-input v-model="applicationOld.paymentProvision" disabled></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                <div>
                  <span style="color: red;">*</span><span>开票比例</span>
                </div>
              </el-col>
              <el-col :span="21">
                <el-row class="rate">
                  <el-col :span="4">
                    <el-form-item prop="advancePayment">
                      <el-input-number :controls="false" v-model="applicationOld.advancePayment" style="width: 100%;"
                        disabled @change="changePay(newform)"></el-input-number>
                    </el-form-item>
                  </el-col>
                  <el-col :span="2">
                    <span>%Advance payment</span>
                  </el-col>

                  <el-col :span="4">
                    <el-form-item prop="downPayment">
                      <el-input-number :controls="false" v-model="applicationOld.downPayment" style="width: 100%;"
                        disabled @change="changePay(newform)"></el-input-number>
                    </el-form-item>
                  </el-col>
                  <el-col :span="2">
                    <span>%Down payment</span>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item prop="balancePayment">
                      <el-input-number :controls="false" v-model="applicationOld.balancePayment" style="width: 100%;"
                        disabled @change="changePay(newform)"></el-input-number>
                    </el-form-item>
                  </el-col>
                  <el-col :span="2">
                    <span>%Balance payment</span>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item prop="payment">
                      <el-input-number :controls="false" v-model="applicationOld.payment" style="width: 100%;" disabled
                        @change="changePay(newform)"></el-input-number>
                    </el-form-item>
                  </el-col>
                  <el-col :span="2">
                    <span>%payment</span>
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                开票说明
              </el-col>
              <el-col :span="21">
                <el-form-item prop="invoiceInstructions">
                  <el-input v-model="applicationOld.invoiceInstructions" disabled></el-input>
                </el-form-item>
              </el-col>
            </el-row>
          </el-main>
        </el-container>
      </el-container>
    </el-form>
  </div>
  <div class="body">
    <div class="tit">开具发票申请单</div>
    <el-form :model="application" :rules="rules" ref="newform" inline-message>
      <el-container>
        <el-header>
          <el-row>
            <el-col :span="4">
              申请部门
            </el-col>
            <el-col :span="4">
              <el-form-item prop="applicationDepartment">
                <el-input v-model="application.applicationDepartment" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              申请人
            </el-col>
            <el-col :span="4">
              <el-form-item prop="applyPerson">
                <el-input v-model="application.applyPerson" readonly></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              申请时间
            </el-col>
            <el-col :span="4">
              <el-form-item prop="applyTime">
                <el-input v-model="application.applyTime" readonly></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="4">
              发票类别
            </el-col>
            <el-col :span="20">
              <el-form-item prop="type">
                <el-select v-model="application.type" @change="changeType" :disabled="use_store.operation == 1">
                  <el-option label="外销-形式发票-干箱-自接" value="外销-形式发票-干箱-自接"></el-option>
                  <el-option label="外销-形式发票-干箱-统接" value="外销-形式发票-干箱-统接"></el-option>
                  <el-option label="外销-形式发票-干箱-BSL" value="外销-形式发票-干箱-BSL"></el-option>
                  <el-option label="外销-形式发票-零部件" value="外销-形式发票-零部件"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="4">
              <div>
                <span style="color: red;" v-if="application.type != '外销-形式发票-干箱-统接'">*</span><span>合同号</span>
              </div>
            </el-col>
            <el-col :span="8">
              <el-form-item :prop="application.type == '外销-形式发票-干箱-统接' ? 'contractNo1' : 'contractNo'">
                <el-input v-model="application.contractNo" :disabled="use_store.operation == 1"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <div>
                <span style="color: red;">*</span><span>计划回款时间</span>
              </div>
            </el-col>
            <el-col :span="8">
              <el-form-item prop="planPayTime">
                <el-date-picker v-model="application.planPayTime" type="date" placeholder="Pick a Date"
                  format="YYYY/MM/DD" :disabled="use_store.operation == 1" />
              </el-form-item>
            </el-col>
          </el-row>

        </el-header>
        <el-container>
          <el-col :span="2">
            <el-aside>
              发票信息
            </el-aside>
          </el-col>
          <el-main>
            <el-row>
              <el-col :span="3">
                <div>
                  <span style="color: red;">*</span><span>客户名称</span>
                </div>
              </el-col>
              <el-col :span="21">
                <el-form-item prop="customerName">
                  <el-select v-model="application.customerName" filterable remote reserve-keyword placeholder="请选择"
                    @change="changeCustomerName" :remote-method="searchCustomer" :loading="loading">
                    <el-option v-for="item in customerNameOptions" :key="item.id" :label="item.name"
                      :value="item.name" />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                地址
              </el-col>
              <el-col :span="21">
                <el-form-item prop="customerAddress">
                  <el-input v-model="application.customerAddress" readonly></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                <div>
                  <span style="color: red;">*</span><span>价格条款</span>
                </div>
              </el-col>
              <el-col :span="21">
                <el-form-item prop="priceTerms">
                  <el-radio-group v-model="application.priceTerms" @change="changePrice"
                    :disabled="use_store.operation == 1">
                    <el-radio label="CY" :disabled="application.type == '外销-形式发票-零部件'">CY</el-radio>
                    <el-radio label="Ex-Works" :disabled="application.type == '外销-形式发票-零部件'">Ex-Works</el-radio>
                    <el-radio label="DAP">DAP</el-radio>
                    <el-radio label="other" :disabled="application.type == '外销-形式发票-零部件'">其他<input type="text"
                        style="width:250px" v-model="other"></el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                <div>
                  <span style="color: red;">*</span><span>付款条款</span>
                </div>
              </el-col>
              <el-col :span="21">
                <el-form-item prop="paymentProvision">
                  <el-input v-model="application.paymentProvision" :disabled="use_store.operation == 1"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                <div>
                  <span style="color: red;">*</span><span>开票比例</span>
                </div>
              </el-col>
              <el-col :span="21">
                <el-row class="rate">
                  <el-col :span="4">
                    <el-form-item prop="advancePayment">
                      <el-input-number :controls="false" v-model="application.advancePayment" style="width: 100%;"
                        :disabled="application.downPayment != undefined || application.balancePayment != undefined || use_store.operation == 1 || application.payment != undefined"
                        @change="changePay(newform)"></el-input-number>
                    </el-form-item>
                  </el-col>
                  <el-col :span="2">
                    <span>%Advance payment</span>
                  </el-col>

                  <el-col :span="4">
                    <el-form-item prop="downPayment">
                      <el-input-number :controls="false" v-model="application.downPayment" style="width: 100%;"
                        :disabled="application.advancePayment != undefined || application.balancePayment != undefined || use_store.operation == 1 || application.payment != undefined"
                        @change="changePay(newform)"></el-input-number>
                    </el-form-item>
                  </el-col>
                  <el-col :span="2">
                    <span>%Down payment</span>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item prop="balancePayment">
                      <el-input-number :controls="false" v-model="application.balancePayment" style="width: 100%;"
                        :disabled="application.downPayment != undefined || application.advancePayment != undefined || use_store.operation == 1 || application.payment != undefined"
                        @change="changePay(newform)"></el-input-number>
                    </el-form-item>
                  </el-col>
                  <el-col :span="2">
                    <span>%Balance payment</span>
                  </el-col>
                  <el-col :span="4">
                    <el-form-item prop="payment">
                      <el-input-number :controls="false" v-model="application.payment" style="width: 100%;"
                        :disabled="application.downPayment != undefined || application.advancePayment != undefined || use_store.operation == 1 || application.balancePayment != undefined"
                        @change="changePay(newform)"></el-input-number>
                    </el-form-item>
                  </el-col>
                  <el-col :span="2">
                    <span>%payment</span>
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                开票说明
              </el-col>
              <el-col :span="21">
                <el-form-item prop="invoiceInstructions">
                  <el-input v-model="application.invoiceInstructions" :disabled="use_store.operation == 1"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row>
              <el-col :span="3">
                <div>
                  <span style="color: red;" v-if="application.type != '外销-形式发票-干箱-统接'">*</span><span>合同</span>
                </div>
              </el-col>
              <el-col :span="21">
                <el-form-item prop="fileList" class="upLoad">
                  <el-upload type="primary" v-model:file-list="fileList" :show-file-list="false"
                    :action="`api/files/upload/`" :headers="headers" :on-success="onSuccess"
                    :on-change="handleChangePic">
                    <el-button>上传</el-button>
                  </el-upload>
                  <el-button :disabled="application.file == ''" style="margin-left: 20px;" @click="donwload">
                    {{ application.fileName ? application.fileName : '下载' }}
                  </el-button>
                </el-form-item>
              </el-col>
            </el-row>
          </el-main>
        </el-container>
      </el-container>
    </el-form>
    <div class="foot"><span>说明：</span> 以上提供开票内容必须真实、完整、合法，并附有效合同。</div>
    <div v-if="use_store.operation == 1">
      <el-button type="primary" @click="cancel">返回</el-button>
    </div>
    <div v-else>
      <el-button type="primary" @click="cancel">取消</el-button>
      <el-button type="primary" @click="draft(newform)" v-loading.fullscreen.lock="fullscreenLoading">草稿</el-button>
      <el-button type="primary" @click="save(newform)" v-loading.fullscreen.lock="fullscreenLoading">提交</el-button>
    </div>
  </div>
</template>
<script setup>
import { ref, reactive, onMounted } from "vue"
import { useRouter } from "vue-router";
import { math } from '@/utils/math';
import { getCustomer, saveGanXiang, saveLingBuJian, ganxiang, lingbujian, findAllByName, xiuGaiGanXiang, xiuGaiLingBuJian, draftGanXiang, draftLingbujian, deleteFile } from "@/utils/invoice";
import { useStore } from "@/stores/counter";
const router = useRouter();
const myDate = new Date();
const use_store = useStore()
const newform = ref()
const fullscreenLoading = ref(false)
const application = ref({
  type: '',
  applicationDepartment: JSON.parse(localStorage.getItem("user")).department,
  applyPerson: JSON.parse(localStorage.getItem("user")).username,
  applyTime: myDate.toLocaleDateString(),
  contractNo: '',
  planPayTime: null,
  customerName: '',
  customerAddress: '',
  parentId: null,
  downPayment: undefined,
  advancePayment: undefined,
  balancePayment: undefined,
  payment: undefined,
  priceTerms: 'CY',
  invoiceInstructions: '',
  invoiceRatio: '',
  invoiceMethod: '',
  file: '',
  fileName: ''
})
const applicationOld = ref({
  type: '',
  applicationDepartment: JSON.parse(localStorage.getItem("user")).department,
  applyPerson: JSON.parse(localStorage.getItem("user")).username,
  applyTime: myDate.toLocaleDateString(),
  type: '',
  contractNo: '',
  planPayTime: null,
  customerName: '',
  customerAddress: '',
  parentId: null,
  downPayment: undefined,
  advancePayment: undefined,
  balancePayment: undefined,
  payment: undefined,
  priceTerms: 'CY',
  invoiceInstructions: '',
  invoiceRatio: '',
  invoiceMethod: '',
  file: undefined,
  fileName: ''
})

const fileList = ref([])

const other = ref('')
const otherOld = ref('')

const customerNameOptions = ref({})

onMounted(() => {
  getCustomer().then(res => {
    customerNameOptions.value = res.data;
  })
  if (use_store.operation != 3) {
    if (use_store.name.indexOf("零部件") >= 0) {
      lingbujian(use_store.id).then(res => {
        application.value = res.data.new
        if (res.data.new.parentId != null) {
          applicationOld.value = res.data.old
          if (res.data.old.invoiceMethod == "Advance Payment") {
            applicationOld.value.advancePayment = res.data.old.invoiceRatio
          }
          else if (res.data.old.invoiceMethod == "Down Payment") {
            applicationOld.value.downPayment = res.data.old.invoiceRatio
          }
          else if (res.data.old.invoiceMethod == "Balance Payment") {
            applicationOld.value.balancePayment = res.data.old.invoiceRatio
          } else {
            applicationOld.value.payment = res.data.old.invoiceRatio
          }
        }
        if (res.data.new.invoiceMethod == "Advance Payment") {
          application.value.advancePayment = res.data.new.invoiceRatio
        }
        else if (res.data.new.invoiceMethod == "Down Payment") {
          application.value.downPayment = res.data.new.invoiceRatio
        }
        else if (res.data.new.invoiceMethod == "Balance Payment") {
          application.value.balancePayment = res.data.new.invoiceRatio
        } else {
          application.value.payment = res.data.new.invoiceRatio
        }
        if (use_store.operation == 4) {
          application.value.applicationDepartment = JSON.parse(localStorage.getItem("user")).department
          application.value.applyPerson = JSON.parse(localStorage.getItem("user")).username
          application.value.applyTime = myDate.toLocaleDateString()
        }
      })
    } else {
      ganxiang(use_store.id).then(res => {
        application.value = JSON.parse(JSON.stringify(res.data.new))
        if (use_store.operation == 4) {
          application.value.applicationDepartment = JSON.parse(localStorage.getItem("user")).department
          application.value.applyPerson = JSON.parse(localStorage.getItem("user")).username
          application.value.applyTime = myDate.toLocaleDateString()
        }
        if (res.data.new.priceTerms != "CY" && res.data.new.priceTerms != "Ex-Works" && res.data.new.priceTerms != "DAP") {
          application.value.priceTerms = 'other'
          other.value = res.data.priceTerms
        }

        if (res.data.new.invoiceMethod == "Advance Payment") {
          application.value.advancePayment = res.data.new.invoiceRatio
        }
        else if (res.data.new.invoiceMethod == "Down Payment") {
          application.value.downPayment = res.data.new.invoiceRatio
        }
        else if (res.data.new.invoiceMethod == "Balance Payment") {
          application.value.balancePayment = res.data.new.invoiceRatio
        } else {
          application.value.payment = res.data.new.invoiceRatio
        }
        if (res.data.new.parentId != null) {
          applicationOld.value = JSON.parse(JSON.stringify(res.data.old))
          if (res.data.old.priceTerms != "CY" && res.data.old.priceTerms != "Ex-Works" && res.data.old.priceTerms != "DAP") {
            applicationOld.value.priceTerms = 'other'
            otherOld.value = res.data.old.priceTerms
          }

          if (res.data.old.invoiceMethod == "Advance Payment") {
            applicationOld.value.advancePayment = res.data.old.invoiceRatio
          }
          else if (res.data.old.invoiceMethod == "Down Payment") {
            applicationOld.value.downPayment = res.data.old.invoiceRatio
          }
          else if (res.data.old.invoiceMethod == "Balance Payment") {
            applicationOld.value.balancePayment = res.data.old.invoiceRatio
          } else {
            applicationOld.value.payment = res.data.old.invoiceRatio
          }
        }
      })
    }
  }
})

// function changePayment(rule, value, cb) {
//   if (application.value.advancePayment == '' && application.value.downPayment == '' && application.value.balancePayment == '') {

//     cb(new Error('请填写'))
//   } else {
//     return cb()
//   }
// }

function advance(rule, value, callback) {
  if ((application.value.advancePayment == '' || application.value.advancePayment == undefined)
    && (application.value.balancePayment == '' || application.value.balancePayment == undefined)
    && (application.value.downPayment == '' || application.value.downPayment == undefined)
    && (application.value.payment == '' || application.value.payment == undefined)) {
    callback(new Error('请填写'))
  } else {
    callback()
  }
}

function upLoad(rule, value, callback) {
  if (fileList.value.length > 0 || application.value.type == '外销-形式发票-干箱-统接' || (application.value.file != null && application.value.file != undefined)) {
    callback()
  } else {
    callback(new Error('请上传'))
  }
}

function donwload() {
  window.location.href = `/api/files/ty/${application.value.file}`
}

const rules = reactive({
  type: [
    { required: true, message: '请填写', trigger: 'change' },
  ],
  contractNo: [
    { required: true, message: '请填写', trigger: 'change' },
  ],
  contractNo1: [
    { required: false, message: '请填写', trigger: 'change' },
  ],
  planPayTime: [
    { required: true, message: '请选择', trigger: 'change' },
  ],
  customerName: [
    { required: true, message: '请选择', trigger: 'change' },
  ],
  paymentProvision: [
    { required: true, message: '请填写', trigger: 'change' },
  ],
  advancePayment: [
    { validator: advance, message: '请填写', trigger: 'change' },
  ],
  fileList: [
    { validator: upLoad, required: 'true', trigger: 'change' },
  ],
})

function cancel() {
  router.push({
    path: '/list'
  })
}

function searchCustomer(params) {
  findAllByName({ name: params }).then(res => {
    customerNameOptions.value = res.data
  })
}

function changeCustomerName() {
  customerNameOptions.value.map(item => {
    if (item.name == application.value.customerName) {
      application.value.customerAddress = item.address
      application.value.customerPayNumber = item.taxIdentificationNumber
      application.value.customerNameEasy = item.easyName
      application.value.paymentProvision = item.paymentMethod
    }
  })
}

function changePay(newform) {
  newform.validateField("advancePayment")
}

function draft(newform) {
  newform.validateField(["type"], (valid, falids) => {
    if (valid) {
      fullscreenLoading.value = true
      if (application.value.priceTerms == 'other') {
        application.value.priceTerms = other.value
      }
      if (use_store.operation == 4) {
        application.value.id = ''
        application.value.numberNo = ''
        application.value.createTime = ''
        application.value.status = ''
      }
      if (application.value.planPayTime != null) {
        application.value.planPayTime = new Date(application.value.planPayTime).toLocaleDateString()
      }
      if (application.value.type != '外销-形式发票-零部件') {
        application.value.invoiceRatio = math.addTwo(math.addTwo(application.value.advancePayment, application.value.downPayment), math.addTwo(application.value.balancePayment, application.value.payment))
        if (application.value.advancePayment != " " && application.value.advancePayment != null) {
          application.value.invoiceMethod = "Advance Payment"
        } else if (application.value.downPayment != " " && application.value.downPayment != null) {
          application.value.invoiceMethod = "Down Payment"
        } else if (application.value.balancePayment != " " && application.value.balancePayment != null) {
          application.value.invoiceMethod = "Balance Payment"
        } else {
          application.value.invoiceMethod = "payment"
        }
        draftGanXiang(application.value).then(res => {
          fullscreenLoading.value = false
          cancel()
        })
      } else {
        draftLingbujian(application.value).then(res => {
          fullscreenLoading.value = false
          cancel()
        })

      }
    } else {
    }
  })
}

function save(newform) {
  newform.validate((valid, falids) => {
    if (valid) {
      fullscreenLoading.value = true
      if (application.value.status == '草稿') {
        application.value.id = ''
      }
      if (use_store.operation == 4) {
        application.value.id = ''
        application.value.numberNo = ''
        application.value.createTime = ''
        application.value.status = ''
      }
      if (application.value.type == '外销-形式发票-干箱-统接') {
        application.value.file = null
        application.value.fileName = null
      }
      if (application.value.priceTerms == 'other') {
        application.value.priceTerms = other.value
      }
      application.value.planPayTime = new Date(application.value.planPayTime).toLocaleDateString()
      application.value.invoiceRatio = math.addTwo(math.addTwo(application.value.advancePayment, application.value.downPayment), math.addTwo(application.value.balancePayment, application.value.payment))
      if (application.value.advancePayment != " " && application.value.advancePayment != null) {
        application.value.invoiceMethod = "Advance Payment"
      } else if (application.value.downPayment != " " && application.value.downPayment != null) {
        application.value.invoiceMethod = "Down Payment"
      } else if (application.value.balancePayment != " " && application.value.balancePayment != null) {
        application.value.invoiceMethod = "Balance Payment"
      } else {
        application.value.invoiceMethod = "payment"
      }
      if (application.value.type != '外销-形式发票-零部件') {
        if (application.value.status == '待审核' || application.value.status == '已开票') {
          xiuGaiGanXiang(application.value).then(res => {
            fullscreenLoading.value = false
            cancel()
          })
        } else {
          saveGanXiang(application.value).then(res => {
            fullscreenLoading.value = false
            cancel()
          })
        }
      } else {
        if (application.value.status == '待审核' || application.value.status == '已开票') {
          xiuGaiLingBuJian(application.value).then(res => {
            fullscreenLoading.value = false
            cancel()
          })
        } else {
          saveLingBuJian(application.value).then(res => {
            fullscreenLoading.value = false
            cancel()
          })
        }
      }
    } else {
    }
  })
}

function handleChangePic(file, fileList) {
  if (fileList.length > 1) {
    deleteFile(application.value.file.flag)
    fileList.splice(0, 1);
  }
}

function onSuccess(res) {
  console.log(fileList);
  application.value.file = res.data.flag
  application.value.fileName = res.data.fileName
  newform.value.validateField("fileList")
}
// function fileRule(newform) {
//   newform.validateField("fileList")
// }
// function changeMoney() {
//   application.value.box.map(item => {
//     item.money = math.multiplyTwo(item.number, item.priceTerms)
//   })
// }

function changeType() {
  if (application.value.type == "外销-形式发票-零部件") {
    application.value.priceTerms = "DAP"
    application.value.payment = 100
  }
}

</script>
<style lang="scss" scoped>
.body {
  margin: auto;
  margin-top: 15%;
  width: 1200px;
  text-align: center;

  .tit {
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 20px;
  }

  .foot {
    text-align: left;
    margin-top: 20px;

    span {
      font-weight: 700;
    }
  }

  .el-form-item {
    width: 100%;
    margin-bottom: 0px;
  }

  .rate {
    .el-col {
      border: none;
    }
  }
}

.el-header {
  height: auto;
  padding: 0px;
}

.el-main {
  padding: 0px;
  overflow: hidden;

  .title {
    .el-col {
      height: 34px;
    }
  }
}



.el-col {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid black;
  text-align: center;
  padding: 0px;
}

.el-aside {
  text-align: center;
  width: auto;
  overflow: hidden;
}

.upLoad {
  :deep(.el-form-item__content) {
    .el-upload-list--text {
      display: inline-block;
    }
  }
}
</style>